<!DOCTYPE html>
<html lang="zh">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>我的作品</title>
  <script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-gradient-to-br from-blue-100 to-purple-100 min-h-screen flex items-center justify-center p-4">

  <div class="w-full max-w-2xl bg-white rounded-2xl shadow-xl p-8 space-y-8">
    <h1 class="text-3xl font-bold text-center text-gray-800">我的作品</h1>
    <div class="grid grid-cols-1 sm:grid-cols-2 gap-6">
      <!-- 作品项示例，后续可复制添加 -->
      <a href="./jokes.html" class="block bg-blue-50 rounded-xl p-4 shadow hover:shadow-lg transition group">
        <div class="font-semibold text-lg text-blue-700 group-hover:underline">随机笑话</div>
        <div class="text-gray-500 text-sm mt-2">轻松时刻！</div>
      </a>
      <a href="./motivation.html" class="block bg-blue-50 rounded-xl p-4 shadow hover:shadow-lg transition group">
        <div class="font-semibold text-lg text-blue-700 group-hover:underline">励志短句</div>
        <div class="text-gray-500 text-sm mt-2">心灵鸡汤</div>
      </a>
      <a href="./champion.html" class="block bg-blue-50 rounded-xl p-4 shadow hover:shadow-lg transition group">
        <div class="font-semibold text-lg text-blue-700 group-hover:underline">英雄联盟百科</div>
        <div class="text-gray-500 text-sm mt-2">英雄百科</div>
      </a>
      <!-- 更多作品项 -->
    </div>
    <div class="text-center pt-4">
      <a href="index.html" class="text-blue-600 hover:underline">返回主页</a>
    </div>
  </div>

</body>
</html>